.board {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  margin: auto;
  border: 2px solid black;
  width: min(90vw, 100vh - 160px);
  height: min(90vw, 100vh - 160px);
}

.board > div {
  display: flex;
  width: 100%;
  height: 100%;
}

.board div button.box {
  display: flex;
  flex-grow: 1;
  cursor: pointer;
  border: none;
}

.board div:nth-child(even) button:nth-child(odd) {
  background-color: black;
}

.board div:nth-child(odd) button:nth-child(even) {
  background-color: black;
}

.board div button.box.selected {
  transition: all 0.33s;
  background-color: red;
}

button:focus-visible {
  outline: 4px solid yellowgreen;
  z-index: 1;
}
